<template>
  <div>
    <div style="background-color: burlywood; height: 695px;">
      <el-row :gutter="20">
        <el-col :span="6" :offset="9" style="background-color: rgba(118,194,88,0.8);margin-top: 100px;border-radius: 15px 15px 0 0;">
          <div class="grid-content bg-purple" style="width: 100%; height: 80px; text-align: center;
    	  line-height: 80px; color: cadetblue;font-size: 22px;">回收员登录</div>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6" :offset="9" style="height: 80px; background-color: rgba(255,255,255,0.8);">
          <el-row>
            <el-col :span="18" :offset="3" style="margin-top: 20px;">
              <el-input placeholder="请输入账号" prefix-icon="el-icon-user" v-model="recycle.recycleAccount">
              </el-input>
            </el-col>
          </el-row>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6" :offset="9" style="height: 80px; background-color: rgba(255,255,255,0.8);">
          <el-row>
            <el-col :span="18" :offset="3" style="margin-top: 20px;">
              <el-input placeholder="请输入密码" prefix-icon="el-icon-lock" v-model="recycle.recyclePwd" show-password>
              </el-input>
            </el-col>
          </el-row>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6" :offset="9" style="height: 80px; background-color: rgba(255,255,255,0.8);">
          <el-row>
            <el-col :span="18" :offset="3" style="margin-top: 20px;">
              <el-row>
                <el-button type="primary" @click="login" style="width: 100%;  ">立即登录</el-button>
              </el-row>
            </el-col>
          </el-row>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6" :offset="9" style="height: 40px; background-color: rgba(255,255,255,0.8);">
          <a style="color: black;	text-decoration: none; float: right;" href="#/index">
            登录首页&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          </a>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="6" :offset="9" style="height: 80px; background-color: transparent;">
          <el-row>
            <el-col :span="18" :offset="3" style="margin-top: 20px;">
              <div>
                @版权所有 &nbsp;&nbsp;&nbsp;&nbsp;100期 &nbsp;&nbsp;&nbsp;&nbsp;| &nbsp;&nbsp;&nbsp;&nbsp;
                <el-link href="http://www.woniuxy.com" type="primary">蜗牛学院</el-link>
              </div>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'RecycleLogin',
    data () {
      return {
        recycle:{
        	recycleAccount:'',
        	recyclePwd:''
        }
      }
    },
    methods:{
      login(){
        if(this.recycle.recycleAccount==null||this.recycle.recycleAccount==''||this.recycle.recyclePwd==''||this.recycle.recyclePwd==null){
          alert("请完善登录信息")
        }else{
          this.$http.post("/site/recycleAccount/login.recycle",this.recycle).then(resp=>{
            if(resp.data.code==200){
              alert(resp.data.message)
              localStorage.setItem("siteAccountMessage",JSON.stringify(resp.data.data))
              this.$router.push("/recycleOrderManage")
             }else{
               this.recycle.recyclePwd=''
               alert(resp.data.message)
             }
          })
        }
      }
    }
  }
</script>

<style type="text/css">
  .el-input__inner {
    border: 0;
    background-color: azure;
    border-bottom: 1px solid skyblue;
    border-radius: 0;
  }

  * {
    margin: 0;
    padding: 0;
  }
</style>
